<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:v-bind="http://www.w3.org/1999/xhtml"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="UTF-8">
    <title>批改页面</title>
    <link href="/css/maint.css" rel="stylesheet" type="text/css" />
    <link href="/css/iconfont.css" rel="stylesheet" type="text/css" />
    <link href="/css/test.css" rel="stylesheet" type="text/css" />
    <!-- jQuery -->
    <script src="/vendors/jquery/dist/jquery.min.js"></script>
    <!-- vue -->
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js" type="text/javascript"></script>
    <!-- layer -->
    <script src="https://cdn.bootcss.com/layer/2.1/layer.js" type="text/javascript"></script>

    <style>
        .hasBeenAnswer {
            background: #5d9cec;
            color:#fff;
        }

    </style>
</head>

<body>
<input id="paperId" type="hidden" th:value="${achievementId}">
<div class="main">
    <!--nr start-->
    <div id="modelDiv" class="test_main">
        <div class="nr_left">
            <div class="test">
                <form>
                    <div class="test_title">
                        <p class="test_time">
                        </p>
                        <font><input type="button" @click="correction()" name="test_jiaojuan" value="批阅"></font>
                    </div>

                    <div class="test_content" v-if="iSingleChoice">
                        <div class="test_content_title">
                            <h2>单选题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{singleChoices.length}}</i><span>题，</span><span>合计</span><i class="content_fs">{{sumSingleChoices}}</i><span>分</span>
                            </p>
                        </div>
                    </div>
                    <div class="test_content_nr" v-for="singleChoice in singleChoices">
                        <ul>

                            <li :id="singleChoice.liId">
                                <div class="test_content_nr_tt">
                                    <i>{{singleChoice.tNumber}}</i><span>({{singleChoice.score}}分)</span><font>{{singleChoice.content}}</font><span style="color: #bf0606">得分：<input :id="singleChoice.id" type="number" step="0.5" style="height: 20px;width: 50px" value="0"></span><b class="icon iconfont">&#xe881;</b>
                                </div>

                                <div class="test_content_nr_main">
                                    <ul>

                                        <li class="option" v-if="singleChoice.referenceAnswer=='A'" style="border: 2px solid red">

                                            <input type="radio" class="radioOrCheck" :name="singleChoice.answerId" disabled="disabled"
                                                   :id="singleChoice.inId[0]"
                                            />


                                            <label :for="singleChoice.inId[0]">
                                                A.
                                                <p class="ue" style="display: inline;">{{singleChoice.optionA}}</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>

                                            <input type="radio" class="radioOrCheck" :name="singleChoice.answerId" disabled="disabled"
                                                   :id="singleChoice.inId[0]"
                                            />


                                            <label :for="singleChoice.inId[0]">
                                                A.
                                                <p class="ue" style="display: inline;">{{singleChoice.optionA}}</p>
                                            </label>
                                        </li>

                                        <li class="option" v-if="singleChoice.referenceAnswer=='B'" style="border: 2px solid red">

                                            <input type="radio" class="radioOrCheck" :name="singleChoice.answerId" disabled="disabled"
                                                   :id="singleChoice.inId[1]"
                                            />


                                            <label :for="singleChoice.inId[1]">
                                                B.
                                                <p class="ue" style="display: inline;">{{singleChoice.optionB}}</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>

                                            <input type="radio" class="radioOrCheck" :name="singleChoice.answerId" disabled="disabled"
                                                   :id="singleChoice.inId[1]"
                                            />


                                            <label :for="singleChoice.inId[1]">
                                                B.
                                                <p class="ue" style="display: inline;">{{singleChoice.optionB}}</p>
                                            </label>
                                        </li>

                                        <li class="option" v-if="singleChoice.referenceAnswer=='C'" style="border: 2px solid red">

                                            <input type="radio" class="radioOrCheck" :name="singleChoice.answerId" disabled="disabled"
                                                   :id="singleChoice.inId[2]"
                                            />


                                            <label :for="singleChoice.inId[2]">
                                                C.
                                                <p class="ue" style="display: inline;">{{singleChoice.optionC}}</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>

                                            <input type="radio" class="radioOrCheck" :name="singleChoice.answerId" disabled="disabled"
                                                   :id="singleChoice.inId[2]"
                                            />


                                            <label :for="singleChoice.inId[2]">
                                                C.
                                                <p class="ue" style="display: inline;">{{singleChoice.optionC}}</p>
                                            </label>
                                        </li>

                                        <li class="option" v-if="singleChoice.referenceAnswer=='D'" style="border: 2px solid red">

                                            <input type="radio" class="radioOrCheck" :name="singleChoice.answerId" disabled="disabled"
                                                   :id="singleChoice.inId[3]"
                                            />


                                            <label :for="singleChoice.inId[3]">
                                                D.
                                                <p class="ue" style="display: inline;">{{singleChoice.optionD}}</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>

                                            <input type="radio" class="radioOrCheck" :name="singleChoice.answerId" disabled="disabled"
                                                   :id="singleChoice.inId[3]"
                                            />


                                            <label :for="singleChoice.inId[3]">
                                                D.
                                                <p class="ue" style="display: inline;">{{singleChoice.optionD}}</p>
                                            </label>
                                        </li>

                                    </ul>
                                </div>
                            </li>
                        </ul>
                    </div>

                    <div class="test_content" v-if="iMultipleChoice">
                        <div class="test_content_title">
                            <h2>多选题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{multipleChoices.length}}</i><span>题，</span><span>合计</span><i class="content_fs">{{sumMultipleChoices}}</i><span>分</span>
                            </p>
                        </div>
                    </div>
                    <div class="test_content_nr" v-for="multipleChoice in multipleChoices">
                        <ul>

                            <li :id="multipleChoice.liId">
                                <div class="test_content_nr_tt">
                                    <i>{{multipleChoice.tNumber}}</i><span>({{multipleChoice.score}}分)</span><font>{{multipleChoice.content}}</font><span style="color: #bf0606">得分：<input :id="multipleChoice.id" type="number" step="0.5" style="height: 20px;width: 50px" value="0"></span><b class="icon iconfont">&#xe881;</b>
                                </div>

                                <div class="test_content_nr_main">
                                    <ul>

                                        <li class="option" v-if="multipleChoice.referenceAnswer.indexOf('A') != -1" style="border: 2px solid red">


                                            <input type="checkbox" class="radioOrCheck" :name="multipleChoice.answerId" disabled="disabled"
                                                   :id="multipleChoice.inId[0]"
                                            />

                                            <label :for="multipleChoice.inId[0]">
                                                A.
                                                <p class="ue" style="display: inline;">{{multipleChoice.optionA}}</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>


                                            <input type="checkbox" class="radioOrCheck" :name="multipleChoice.answerId" disabled="disabled"
                                                   :id="multipleChoice.inId[0]"
                                            />

                                            <label :for="multipleChoice.inId[0]">
                                                A.
                                                <p class="ue" style="display: inline;">{{multipleChoice.optionA}}</p>
                                            </label>
                                        </li>

                                        <li class="option" v-if="multipleChoice.referenceAnswer.indexOf('B') != -1" style="border: 2px solid red">


                                            <input type="checkbox" class="radioOrCheck" :name="multipleChoice.answerId" disabled="disabled"
                                                   :id="multipleChoice.inId[1]"
                                            />

                                            <label :for="multipleChoice.inId[1]">
                                                B.
                                                <p class="ue" style="display: inline;">{{multipleChoice.optionB}}</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>


                                            <input type="checkbox" class="radioOrCheck" :name="multipleChoice.answerId" disabled="disabled"
                                                   :id="multipleChoice.inId[1]"
                                            />

                                            <label :for="multipleChoice.inId[1]">
                                                B.
                                                <p class="ue" style="display: inline;">{{multipleChoice.optionB}}</p>
                                            </label>
                                        </li>

                                        <li class="option" v-if="multipleChoice.referenceAnswer.indexOf('C') != -1" style="border: 2px solid red">


                                            <input type="checkbox" class="radioOrCheck" :name="multipleChoice.answerId" disabled="disabled"
                                                   :id="multipleChoice.inId[2]"
                                            />

                                            <label :for="multipleChoice.inId[2]">
                                                C.
                                                <p class="ue" style="display: inline;">{{multipleChoice.optionC}}</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>


                                            <input type="checkbox" class="radioOrCheck" :name="multipleChoice.answerId" disabled="disabled"
                                                   :id="multipleChoice.inId[2]"
                                            />

                                            <label :for="multipleChoice.inId[2]">
                                                C.
                                                <p class="ue" style="display: inline;">{{multipleChoice.optionC}}</p>
                                            </label>
                                        </li>

                                        <li class="option" v-if="multipleChoice.referenceAnswer.indexOf('D') != -1" style="border: 2px solid red">


                                            <input type="checkbox" class="radioOrCheck" :name="multipleChoice.answerId" disabled="disabled"
                                                   :id="multipleChoice.inId[3]"
                                            />

                                            <label :for="multipleChoice.inId[3]">
                                                D.
                                                <p class="ue" style="display: inline;">{{multipleChoice.optionD}}</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>


                                            <input type="checkbox" class="radioOrCheck" :name="multipleChoice.answerId" disabled="disabled"
                                                   :id="multipleChoice.inId[3]"
                                            />

                                            <label :for="multipleChoice.inId[3]">
                                                D.
                                                <p class="ue" style="display: inline;">{{multipleChoice.optionD}}</p>
                                            </label>
                                        </li>

                                    </ul>
                                </div>
                            </li>
                        </ul>
                    </div>


                    <div class="test_content" v-if="iJudge">
                        <div class="test_content_title">
                            <h2>判断题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{judges.length}}</i><span>题，</span><span>合计</span><i class="content_fs">{{sumJudges}}</i><span>分</span>
                            </p>
                        </div>
                    </div>
                    <div class="test_content_nr" v-for="judge in judges">
                        <ul>

                            <li :id="judge.liId">
                                <div class="test_content_nr_tt">
                                    <i>{{judge.tNumber}}</i><span>({{judge.score}}分)</span><font>{{judge.content}}</font><span style="color: #bf0606">得分：<input :id="judge.id" type="number" step="0.5" style="height: 20px;width: 50px" value="0"></span><b class="icon iconfont">&#xe881;</b>
                                </div>

                                <div class="test_content_nr_main">
                                    <ul>

                                        <li class="option" v-if="judge.referenceAnswer=='True'" style="border: 2px solid red">

                                            <input type="radio" class="radioOrCheck" :name="judge.answerId" disabled="disabled"
                                                   :id="judge.inId[0]"
                                            />


                                            <label :for="judge.inId[0]">
                                                A.
                                                <p class="ue" style="display: inline;">是</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>

                                            <input type="radio" class="radioOrCheck" :name="judge.answerId" disabled="disabled"
                                                   :id="judge.inId[0]"
                                            />


                                            <label :for="judge.inId[0]">
                                                A.
                                                <p class="ue" style="display: inline;">是</p>
                                            </label>
                                        </li>

                                        <li class="option" v-if="judge.referenceAnswer=='False'" style="border: 2px solid red">

                                            <input type="radio" class="radioOrCheck" :name="judge.answerId" disabled="disabled"
                                                   :id="judge.inId[1]"
                                            />


                                            <label :for="judge.inId[1]">
                                                B.
                                                <p class="ue" style="display: inline;">否</p>
                                            </label>
                                        </li>
                                        <li class="option" v-else>

                                            <input type="radio" class="radioOrCheck" :name="judge.answerId" disabled="disabled"
                                                   :id="judge.inId[1]"
                                            />


                                            <label :for="judge.inId[1]">
                                                B.
                                                <p class="ue" style="display: inline;">否</p>
                                            </label>
                                        </li>

                                    </ul>
                                </div>
                            </li>
                        </ul>
                    </div>


                    <div class="test_content" v-if="iFillBlank">
                        <div class="test_content_title">
                            <h2>填空题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{fillBlanks.length}}</i><span>题，</span><span>合计</span><i class="content_fs">{{sumFillBlanks}}</i><span>分</span>
                            </p>
                        </div>
                    </div>
                    <div class="test_content_nr" v-for="fillBlank in fillBlanks">
                        <ul>

                            <li :id="fillBlank.liId">
                                <div class="test_content_nr_tt">
                                    <i>{{fillBlank.tNumber}}</i><span>({{fillBlank.score}}分)</span><font>{{fillBlank.content}}</font><span style="color: #bf0606">得分：<input :id="fillBlank.id" type="number" step="0.5" style="height: 20px;width: 50px" value="0"></span><b class="icon iconfont">&#xe881;</b>
                                </div>

                                <div class="test_content_nr_main">
                                    <input type="text" class="fillBlankStyle" style="height: 30px;border: 1px red solid" :value="fillBlank.referenceAnswer" readonly="readonly">
                                </div>
                                <div class="test_content_nr_main">
                                    <input type="text" :id="fillBlank.inId" class="fillBlankStyle" style="height: 30px" readonly="readonly">
                                </div>
                            </li>

                        </ul>
                    </div>

                    <div class="test_content" v-if="iShortAnswer">
                        <div class="test_content_title">
                            <h2>简答题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{shortAnswers.length}}</i><span>题，</span><span>合计</span><i class="content_fs">{{sumShortAnswers}}</i><span>分</span>
                            </p>
                        </div>
                    </div>
                    <div class="test_content_nr" v-for="shortAnswer in shortAnswers">
                        <ul>

                            <li :id="shortAnswer.liId">
                                <div class="test_content_nr_tt">
                                    <i>{{shortAnswer.tNumber}}</i><span>({{shortAnswer.score}}分)</span><font>{{shortAnswer.content}}</font><span style="color: #bf0606">得分：<input :id="shortAnswer.id" type="number" step="0.5" style="height: 20px;width: 50px" value="0"></span><b class="icon iconfont">&#xe881;</b>
                                </div>

                                <div class="test_content_nr_main">
                                    <textarea class="fillBlankStyle" style="width: 800px;height: 100px;border: 1px red solid" :value="shortAnswer.referenceAnswer" readonly="readonly"></textarea>
                                </div>
                                <div class="test_content_nr_main">
                                    <textarea :id="shortAnswer.inId" class="fillBlankStyle" style="width: 800px;height: 100px" readonly="readonly"></textarea>
                                </div>
                            </li>

                        </ul>
                    </div>


                    <div class="test_content" v-if="iProgramming">
                        <div class="test_content_title">
                            <h2>编程题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{programmings.length}}</i><span>题，</span><span>合计</span><i class="content_fs">{{sumProgrammings}}</i><span>分</span>
                            </p>
                        </div>
                    </div>
                    <div class="test_content_nr" v-for="programming in programmings">
                        <ul>

                            <li :id="programming.liId">
                                <div class="test_content_nr_tt">
                                    <i>{{programming.tNumber}}</i><span>({{programming.score}}分)</span><font>{{programming.content}}</font><span style="color: #bf0606">得分：<input :id="programming.id" type="number" step="0.5" style="height: 20px;width: 50px" value="0"></span><b class="icon iconfont">&#xe881;</b>
                                </div>

                                <div class="test_content_nr_main">
                                    <textarea class="fillBlankStyle" style="width: 800px;height: 100px;border: 1px red solid" :value="programming.referenceAnswer" readonly="readonly"></textarea>
                                </div>
                                <div class="test_content_nr_main">
                                    <textarea :id="programming.inId" class="fillBlankStyle" style="width: 800px;height: 100px" readonly="readonly"></textarea>
                                </div>
                            </li>

                        </ul>
                    </div>



                </form>
            </div>

        </div>
        <div class="nr_right">
            <div class="nr_rt_main">
                <div class="rt_nr1">
                    <div class="rt_nr1_title">
                        <h1>
                            <i class="icon iconfont">&#xe692;</i>答题卡
                        </h1>
                        <p class="test_time">
                        </p>
                    </div>

                    <div class="rt_content" v-if="iSingleChoice">
                        <div class="rt_content_tt">
                            <h2>单选题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{singleChoices.length}}</i><span>题</span>
                            </p>
                        </div>
                        <div class="rt_content_nr answerSheet" >
                            <ul>
                                <li v-for="singleChoice in singleChoices"><a :href="singleChoice.foundLiId">{{singleChoice.tNumber}}</a></li>
                            </ul>
                        </div>
                    </div>

                    <div class="rt_content" v-if="iMultipleChoice">
                        <div class="rt_content_tt">
                            <h2>多选题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{multipleChoices.length}}</i><span>题</span>
                            </p>
                        </div>
                        <div class="rt_content_nr answerSheet">
                            <ul>

                                <li v-for="multipleChoice in multipleChoices"><a :href="multipleChoice.foundLiId">{{multipleChoice.tNumber}}</a></li>

                            </ul>
                        </div>
                    </div>

                    <div class="rt_content" v-if="iJudge">
                        <div class="rt_content_tt">
                            <h2>判断题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{judges.length}}</i><span>题</span>
                            </p>
                        </div>
                        <div class="rt_content_nr answerSheet" >
                            <ul>
                                <li v-for="judge in judges"><a :href="judge.foundLiId">{{judge.tNumber}}</a></li>
                            </ul>
                        </div>
                    </div>

                    <div class="rt_content" v-if="iFillBlank">
                        <div class="rt_content_tt">
                            <h2>填空题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{fillBlanks.length}}</i><span>题</span>
                            </p>
                        </div>
                        <div class="rt_content_nr answerSheet" >
                            <ul>
                                <li v-for="fillBlank in fillBlanks"><a :href="fillBlank.foundLiId">{{fillBlank.tNumber}}</a></li>
                            </ul>
                        </div>
                    </div>


                    <div class="rt_content" v-if="iShortAnswer">
                        <div class="rt_content_tt">
                            <h2>简答题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{shortAnswers.length}}</i><span>题</span>
                            </p>
                        </div>
                        <div class="rt_content_nr answerSheet" >
                            <ul>
                                <li v-for="shortAnswer in shortAnswers"><a :href="shortAnswer.foundLiId">{{shortAnswer.tNumber}}</a></li>
                            </ul>
                        </div>
                    </div>


                    <div class="rt_content" v-if="iProgramming">
                        <div class="rt_content_tt">
                            <h2>编程题</h2>
                            <p>
                                <span>共</span><i class="content_lit">{{programmings.length}}</i><span>题</span>
                            </p>
                        </div>
                        <div class="rt_content_nr answerSheet" >
                            <ul>
                                <li v-for="programming in programmings"><a :href="programming.foundLiId">{{programming.tNumber}}</a></li>
                            </ul>
                        </div>
                    </div>


                </div>
            </div>
        </div>
    </div>
    <!--nr end-->
    <div class="foot"></div>
</div>

<script src="/js/jquery-1.11.3.min.js"></script>
<script src="/js/jquery.easy-pie-chart.js"></script>
<!--时间js-->
<script src="/js/jquery.countdown.js"></script>
<script>


    //倒计时插件初始化
    function initTime(){
        $('time').countDown({
            with_separators : false
        });
        $('.alt-1').countDown({
            css_class : 'countdown-alt-1'
        });
        $('.alt-2').countDown({
            css_class : 'countdown-alt-2',
        });

    }


    var modelVue = new Vue({
        el: "#modelDiv",
        data : {
            //将题的类容分类装好
            singleChoices:[],
            shortAnswers:[],
            programmings:[],
            multipleChoices:[],
            judges:[],
            fillBlanks:[],
            //判断是否有这类题型
            iSingleChoice:false,
            iShortAnswer:false,
            iProgramming:false,
            iMultipleChoice:false,
            iJudge:false,
            iFillBlank:false,
            //计算各个题的总分
            sumSingleChoices:0,
            sumShortAnswers:0,
            sumProgramming:0,
            sumMultipleChoice:0,
            sumJudge:0,
            sumFillBlank:0,
            //总时间(分钟)
            toalTiem : 0,
            //用户答案
            userAnswers:[],

        },
        methods:{
            //初始化试卷
            getPaper: function () {
                var self = this;
                var id = [[${achievementId}]];
                $.ajax({
                    url : "/api/achievement/" + id,
                    type : "get",
                    success : function (rs) {
                        if (rs.status == 200) {
                            console.log(rs);
                            self.userAnswers = rs.data.userAnswers;
                            //开始判断是否有应有的题型 如果有就装相对应属性
                            if(rs.data.singleChoice.length>0){
                                //绑定的v-if需要
                                self.iSingleChoice = true;
                                //丢给定义好的数组
                                self.singleChoices = rs.data.singleChoice;
                                var i = 0;
                                var sumScore =0;
                                //遍历后端传过来的题库
                                for(;i<=rs.data.singleChoice.length;i++){
                                    if (self.singleChoices[i] != undefined) {
                                        //题的序号
                                        self.singleChoices[i].tNumber = i+1;
                                        //每个题的id
                                        self.singleChoices[i]["liId"] = "qu_0_"+i;
                                        //答题卡上对应的题的id（这个是链接，就是根据上面的id去定位到题）
                                        self.singleChoices[i]["foundLiId"] = "#qu_0_"+i;
                                        //每个答案的input框的id
                                        var ii = [];
                                        ii.push("0_answer_"+(i+1)+"_option_1");
                                        ii.push("0_answer_"+(i+1)+"_option_2");
                                        ii.push("0_answer_"+(i+1)+"_option_3");
                                        ii.push("0_answer_"+(i+1)+"_option_4");
                                        self.singleChoices[i]["inId"] = ii;
                                        //每个题的单选框name属性
                                        self.singleChoices[i]["answerId"] = "answer"+(i+1);
                                        //计算每种题型的总分
                                        sumScore = sumScore + self.singleChoices[i].score;
                                    }
                                }
                                //将总分设置进属性，方便标签取值
                                self.sumSingleChoices = sumScore;
                            }
                            if(rs.data.multipleChoice.length>0){
                                self.iMultipleChoice = true;
                                self.multipleChoices = rs.data.multipleChoice;
                                var sumScore =0;
                                var i = 0;
                                for(;i<=rs.data.multipleChoice.length;i++){
                                    if (self.multipleChoices[i] != undefined) {
                                        self.multipleChoices[i].tNumber = i+1;
                                        self.multipleChoices[i]["liId"] = "qu_1_"+i;
                                        self.multipleChoices[i]["foundLiId"] = "#qu_1_"+i;
                                        var ii = [];
                                        ii.push("1_answer_"+(i+1)+"_option_1");
                                        ii.push("1_answer_"+(i+1)+"_option_2");
                                        ii.push("1_answer_"+(i+1)+"_option_3");
                                        ii.push("1_answer_"+(i+1)+"_option_4");
                                        self.multipleChoices[i]["inId"] = ii;
                                        self.multipleChoices[i]["answerId"] = "answer"+(i+1);
                                        sumScore = sumScore + self.multipleChoices[i].score;
                                    }
                                }
                                self.sumMultipleChoices = sumScore;
                            }
                            if(rs.data.judge.length>0){
                                self.iJudge = true;
                                self.judges = rs.data.judge;
                                var sumScore =0;
                                var i = 0;
                                for(;i<=rs.data.judge.length;i++){
                                    if (self.judges[i] != undefined) {
                                        self.judges[i].tNumber = i+1;
                                        self.judges[i]["liId"] = "qu_2_"+i;
                                        self.judges[i]["foundLiId"] = "#qu_2_"+i;
                                        var ii = [];
                                        ii.push("2_answer_"+(i+1)+"_option_1");
                                        ii.push("2_answer_"+(i+1)+"_option_2");
                                        self.judges[i]["inId"] = ii;
                                        self.judges[i]["answerId"] = "answers"+(i+1);
                                        sumScore = sumScore + self.judges[i].score;
                                    }
                                }
                                self.sumJudges = sumScore;
                            }
                            if(rs.data.fillBlank.length>0){
                                self.iFillBlank = true;
                                self.fillBlanks = rs.data.fillBlank;
                                var sumScore =0;
                                var i = 0;
                                for(;i<=rs.data.fillBlank.length;i++){
                                    if (self.fillBlanks[i] != undefined) {
                                        self.fillBlanks[i].tNumber = i+1;
                                        self.fillBlanks[i]["liId"] = "qu_3_"+i;
                                        self.fillBlanks[i]["foundLiId"] = "#qu_3_"+i;
                                        self.fillBlanks[i]["inId"] = "3_answer_"+(i+1)+"_option_1";
                                        self.fillBlanks[i]["answerId"] = "answer"+(i+1);
                                        sumScore = sumScore + self.fillBlanks[i].score;
                                    }
                                }
                                self.sumFillBlanks = sumScore;
                            }
                            if(rs.data.shortAnswer.length>0){
                                self.iShortAnswer = true;
                                self.shortAnswers = rs.data.shortAnswer;
                                var sumScore =0;
                                var i = 0;
                                for(;i<=rs.data.shortAnswer.length;i++){
                                    if (self.shortAnswers[i] != undefined) {
                                        self.shortAnswers[i].tNumber = i+1;
                                        self.shortAnswers[i]["liId"] = "qu_4_"+i;
                                        self.shortAnswers[i]["foundLiId"] = "#qu_4_"+i;
                                        self.shortAnswers[i]["inId"] = "4_answer_"+(i+1)+"_option_1";
                                        self.shortAnswers[i]["answerId"] = "answer"+(i+1);
                                        sumScore = sumScore + self.shortAnswers[i].score;
                                    }
                                }
                                self.sumShortAnswers = sumScore;
                            }
                            if(rs.data.programming.length>0){
                                self.iProgramming = true;
                                self.programmings = rs.data.programming;
                                var sumScore =0;
                                var i = 0;
                                for(;i<=rs.data.programming.length;i++){
                                    if (self.programmings[i] != undefined) {
                                        self.programmings[i].tNumber = i+1;
                                        self.programmings[i]["liId"] = "qu_5_"+i;
                                        self.programmings[i]["foundLiId"] = "#qu_5_"+i;
                                        self.programmings[i]["inId"] = "5_answer_"+(i+1)+"_option_1";
                                        self.programmings[i]["answerId"] = "answer"+(i+1);
                                        sumScore = sumScore + self.programmings[i].score;
                                    }
                                }
                                self.sumProgrammings = sumScore;
                            }

                        } else {
                            layer.msg(rs.message, {icon: 0});
                        }
                    },
                    error : function (rs) {
                        layer.msg(rs.responseText, {icon: 0});
                    }
                });
            },

            //批改试卷
            correction:function(){
                var self = this;
                var allScore = 0;
                for(var i=0;i<self.userAnswers.length;i++){
                    var c = self.userAnswers[i].questionId;
                    var f = document.getElementById(c).value;
                    var d = parseFloat(f);
                    allScore += d;
                }
                var sn = {
                    id : [[${achievementId}]],
                    score : allScore
                }

                console.log(allScore);

                $.ajax({
                    url : "/api/achievementScore",
                    type : "post",
                    contentType: "application/json",
                    data: JSON.stringify(sn),
                    success : function (rs) {
                        console.log(rs);
                        location.href = "/exam/correct";
                    }
                })
            },

            //选中用户答案函数,并判断用户答案是否正确，自动给出客观题分数
            checkedUserAnswers: function () {
                var self = this;
                for(var i=0;i<self.singleChoices.length;i++){
                    for(var j=0;j<self.userAnswers.length;j++){
                        if(self.singleChoices[i].id == self.userAnswers[j].questionId){
                            //选中用户答案
                            if(self.userAnswers[j].userAnswer=="A"){
                                document.getElementById(self.singleChoices[i].inId[0]).checked=true;
                            }else if(self.userAnswers[j].userAnswer=="B"){
                                document.getElementById(self.singleChoices[i].inId[1]).checked=true;
                            }else if(self.userAnswers[j].userAnswer=="C"){
                                document.getElementById(self.singleChoices[i].inId[2]).checked=true;
                            }else if(self.userAnswers[j].userAnswer=="D"){
                                document.getElementById(self.singleChoices[i].inId[3]).checked=true;
                            }
                            if(self.userAnswers[j].userAnswer==self.singleChoices[i].referenceAnswer){
                                var c = self.singleChoices[i].id;
                                var d = self.singleChoices[i].score;
                                document.getElementById(c).value=d;
                            }
                        }
                    }
                }
                for(var i=0;i<self.multipleChoices.length;i++){
                    for(var j=0;j<self.userAnswers.length;j++){
                        if(self.multipleChoices[i].id == self.userAnswers[j].questionId){
                            var s = self.userAnswers[j].userAnswer;
                            if(s.indexOf("A")!=-1){
                                document.getElementById(self.multipleChoices[i].inId[0]).checked=true;
                            }
                            if(s.indexOf("B")!=-1){
                                document.getElementById(self.multipleChoices[i].inId[1]).checked=true;
                            }
                            if(s.indexOf("C")!=-1){
                                document.getElementById(self.multipleChoices[i].inId[2]).checked=true;
                            }
                            if(s.indexOf("D")!=-1){
                                document.getElementById(self.multipleChoices[i].inId[3]).checked=true;
                            }
                            if(self.userAnswers[j].userAnswer==self.multipleChoices[i].referenceAnswer){
                                var c = self.multipleChoices[i].id;
                                var d = self.multipleChoices[i].score;
                                document.getElementById(c).value=d;
                            }
                        }
                    }
                }
                for(var i=0;i<self.judges.length;i++){
                    for(var j=0;j<self.userAnswers.length;j++){
                        if(self.judges[i].id == self.userAnswers[j].questionId){
                            if(self.userAnswers[j].userAnswer=="True"){
                                document.getElementById(self.judges[i].inId[0]).checked=true;
                            }else if(self.userAnswers[j].userAnswer=="False"){
                                document.getElementById(self.judges[i].inId[1]).checked=true;
                            }
                            if(self.userAnswers[j].userAnswer==self.judges[i].referenceAnswer){
                                var c = self.judges[i].id;
                                var d = self.judges[i].score;
                                document.getElementById(c).value=d;
                            }
                        }
                    }
                }
                for(var i=0;i<self.fillBlanks.length;i++){
                    for(var j=0;j<self.userAnswers.length;j++){
                        if(self.fillBlanks[i].id == self.userAnswers[j].questionId){
                            document.getElementById(self.fillBlanks[i].inId).value=self.userAnswers[j].userAnswer;
                        }
                    }
                }
                for(var i=0;i<self.shortAnswers.length;i++){
                    for(var j=0;j<self.userAnswers.length;j++){
                        if(self.shortAnswers[i].id == self.userAnswers[j].questionId){
                            document.getElementById(self.shortAnswers[i].inId).value=self.userAnswers[j].userAnswer;
                        }
                    }
                }
                for(var i=0;i<self.programmings.length;i++){
                    for(var j=0;j<self.userAnswers.length;j++){
                        if(self.programmings[i].id == self.userAnswers[j].questionId){
                            document.getElementById(self.programmings[i].inId).value=self.userAnswers[j].userAnswer;
                        }
                    }
                }
            }
        },
        //这个钩子代表被挂载时触发
        mounted: function () {
            this.getPaper();
        },
        //这个钩子代表数据更新后触发
        updated: function () {
            this.checkedUserAnswers();
        }


    })
</script>

</body>

</html>